<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>图片标签的使用</title>
	</head>
	<body>
		<!--
		    图像标签img
		 -->
		 <h4>图像显示:</h4>
		<!-- 
		    src属性, 放入要显示的图像路径, 必要
		    alt属性, 当图像显示不出来的时候用文字来代
		    title属性, 鼠标悬停图片可以显示标题, 赋值内容
		    width, 设置图片的宽度, 单位像素
		    height, 设置图像的高度, 单位像素
		    border, 设置图片的边框宽度, 单位像素
		
		    1.图像标签可以拥有多个属性, 必须卸载标签名的后面
		    2.属性之间不分先后顺序, 标签名与属性,属性与属性之间均以空格分开
		    3.属性采取键值对的格式, 即key="value"的格式, 属性="属性值"
		-->
		<!-- 
		    目录文件夹和根目录:
		    1.目录文件夹:就是普通文件夹, 里面只不过放了我们做页面所需的相关素材, 如: html文件,图片等.
		    2.根目录: 打开目录文件夹的第一层就是根目录
		 -->
		 <img src="../imgs/che.jpg" alt="荣威汽车" title="荣威汽车" width="200px" border="10px">
		 <!-- 
		    路径:
		        1.相对路径以引用文件所在的位置为参考基础, 而建立的目录路劲
		        这里简单的来说, 图片相对于html页面的位置
		        同级路径直接写名称
		        下一级路径 /文件名
		        上一级路径 ../文件名
		        2.绝对路径: 是指目录下的绝对位置, 直接到达目标位置, 通常是从盘符开始的路径
		  -->
		  <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1607279288684&di=aa6c472720cbe6a5aed195aae0804223&imgtype=0&src=http%3A%2F%2Fimage.bitautoimg.com%2Fappimage-800-w1%2Fmapi%2Fmedia%2F2019%2F11%2F22%2F96973e1a60a148cc88e617d17cd00b4e.jpeg" alt="荣威汽车" title="荣威汽车" width="200px" border="1px">
		  
		  
	</body>
</html>
